import * as echarts from "echarts";

/**
 * 综合多个数据组
 * @param {*} event
 * @returns
 */
export function barEcharts(event, name, istooltip) {
  return {
    tooltip: istooltip ? {
      trigger: "axis",
      axisPointer: {
        type: "cross",
        crossStyle: {
          color: "#999",
        },
        label: {
          show: true,
          fontSize: 16,
        }
      },
    } : null,
    grid: {
      top: "12%",
      left: "3%",
      right: "3%",
      bottom: "5%",
      containLabel: true,
    },
    // dataZoom: [{
    //   type: 'slider',
    //   realtime: true,
    //   start: 0,
    //   end: 30,
    //   height: 10,
    //   backgroundColor: '#082A3D',
    //   borderWidth: 0,
    //   borderColor: 'none',
    //   fillerColor: '#1B3944',
    //   handleSize: 0,
    //   handleStyle: {},
    //   // borderColor: 'red',
    //   textStyle: {
    //     color: '#9EAAB8'
    //   },
    //   bottom: 0
    // }],
    legend: null,
    xAxis: [{
      type: "category",
      data: event.Namelist,
      axisPointer: {
        type: "shadow",
      },
      axisTick: {
        show: false,
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
      },
      axisLabel: {
        // X轴线 标签修改
        color: "rgba(174, 195, 220, 1)", //坐标值得具体的颜色
        fontSize: 16,
        rotate: 45, // 设置标签倾斜角度，单位为度
      },
      axisLine: {
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
      },
      boundaryGap: true, // 首尾柱子是否留白
    },],
    yAxis: {
      type: "value",
      name: name ? name : "",
      // min: 0,
      // max: 250,
      // interval: 50,
      axisLabel: {
        formatter: "{value}",
      },
      axisLabel: {
        // y轴线 标签修改
        color: "rgba(174, 195, 220, 1)", //坐标值得具体的颜色
        fontSize: 15,
      },
      splitLine: {
        //网格线
        lineStyle: {
          color: ["rgba(128, 164, 229, 0.3)"], //网格虚线颜色
          type: "dashed", //设置网格线类型 dotted：虚线   solid:实线
        },
        show: true, //隐藏或显示
      },
      axisLine: {
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
        show: false, //隐藏或显示
      },
    },
    series: event.seriesData,
  };
}

// 趋势折线/曲线
export function getFoldthefiguret(echartsFoldthefigure, event, config) {
  console.warn(config && config["showSplitLine"] ? config["showSplitLine"] : true);

  let colors = [];
  let legendData = [];
  let dataList = [];
  let par = {};
  // symbol:config && config.hasOwnProperty('symbol')?config['symbol']:null
  if (config && config.hasOwnProperty("symbol")) {
    par = {
      symbol: config["symbol"],
    };
  }
  echartsFoldthefigure.forEach((element) => {
    colors.push(element.color);
    legendData.push(element.name);
    dataList.push({
      ...par,
      showSymbol: config && config.hasOwnProperty("showSymbol") ? config["showSymbol"] : true,
      symbolSize: config && config.hasOwnProperty("symbolSize") ? config["symbolSize"] : 0,
      // symbol:config && config.hasOwnProperty('symbol') ?
      // config['symbol']:'rect',
      itemStyle: config && config.hasOwnProperty("itemStyle") ?
        config["itemStyle"] : {
          color: element["areaColor"][0]["color"],
          borderColor: element["areaColor"][0]["color"],
          shadowBlur: 20,
        },
      name: element.name,
      data: element.value,
      namelist: element.namelist,
      type: "line",
      barWidth: 20,
      smooth: config && config["smooth"],
      lineStyle: element.hasOwnProperty("lineStyle") ?
        element.lineStyle : {
          width: 2,
        },
      areaStyle: {
        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          offset: 0,
          color: element["areaColor"][0]["color"],
        },
        {
          offset: 1,
          color: element["areaColor"][1]["color"],
        },
        ]),
      },
      tooltip: element.tooltip
    });
  });
  return {
    color: colors,
    tooltip: {
      trigger: "axis",
      // formatter: function (params) {
      //   var result = "<div><p>" + params[0].name + "</p></div>";
      //   for (var i = 0; i < params.length; i++) {
      //     result +=
      //       params[i].marker +
      //       " " +
      //       params[i].seriesName +
      //       "：" +
      //       params[i].value +
      //       config["yAxisName"] +
      //       "<br>";
      //   }
      //   return result;
      // },
    },
    legend: config && config["legend"] ? {
      data: legendData,
      // icon: 'circle',
      right: "2%",
      top: "2%",
      textStyle: {
        color: "rgba(174, 195, 220, 1)",
      },
    } : "",
    grid: {
      top: "12%",
      left: "3%",
      right: "3%",
      bottom: "2%",
      containLabel: true,
    },

    xAxis: [{
      type: "category",
      data: event,
      axisPointer: {
        type: "shadow",
      },
      axisTick: {
        show: false,
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
      },
      axisLabel: {
        // X轴线 标签修改
        color: "rgba(174, 195, 220, 1)", //坐标值得具体的颜色
        fontSize: 15,
        rotate: config && config.hasOwnProperty("rotate") ? config["rotate"] : 0,
      },
      axisLine: {
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
      },
    },],
    yAxis: [{
      type: "value",
      name: "单位:" + config.yAxisName,
      axisLabel: {
        // y轴线 标签修改
        color: "rgba(174, 195, 220, 1)", //坐标值得具体的颜色
        fontSize: 15,
        formatter: "{value}",
      },
      splitLine: {
        //网格线
        lineStyle: {
          color: ["rgba(128, 164, 229, 0.3)"], //网格虚线颜色
          type: "dashed", //设置网格线类型 dotted：虚线   solid:实线
        },
        show: true, //隐藏或显示
      },
      axisLine: {
        lineStyle: {
          color: "rgba(128, 164, 229, 0.3)",
        },
        show: false, //隐藏或显示
      },
    },],
    series: dataList,
  };
}



/**
 * 扇形图表
 * @param {*} event
 * @param {*} name //名称列表
 * @param {*} color //颜色列表
 *
 * @param {*} legend
 * @returns
 */
export function getEventProportions(data) {
//   var xMax = 500;
//   var dataShadow = [];
//   for (var i = 0; i < echartData.length; i++) {
//     dataShadow.push(xMax);
// }
  return {
    // backgroundColor: '#012248',
    tooltip: {
      trigger: "item",
      formatter: "{b} : {c}万元  {d}%",
    },
    toolbox: {
      show: true,
    },
    legend: {
      show: false,
      orient: 'vertical',
      right: '0%',
      top: '18%',
      itemGap: 30,
      textStyle: {
        color: '#ffffff',
        fontSize: 12,
      },
      data: data.map(v => v.name)
    },
    series: [
      {
        name: 'Access From',
        type: 'pie',
        radius: ['30%', '80%'],
        avoidLabelOverlap: true,
        itemStyle: {
          borderRadius: 10,
          borderWidth: 2,
          color: function (params) {
            const colorList = [
              {
                c1: ' #FF5745',
                c2: '#D05A4D',
              },
              {
                c1: ' #FA981E',
                c2: '#EC7322',
              },
              {
                c1: '#FFD145',
                c2: '#FFD145',
              },
              {
                c1: ' #238483',
                c2: '#55C27C',
              },
              {
                c1: ' #45EAFF',
                c2: '#40ADAC',
              },
              {
                c1: '#12B3F8',
                c2: '#7DE8FF',
              },
              {
                c1: ' #0176D3',
                c2: '#13B7FF',
              },
              {
                c1: '#015BD3',
                c2: '#138DFF',
              },
              {
                c1: ' #7c94e7',
                c2: '#1e2783',
              }
            ];
            return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
              {
                offset: 0,
                color: colorList[params.dataIndex].c1,
              },
              {
                offset: 1,
                color: colorList[params.dataIndex].c2,
              }
            ])
          },
        },
  
        label: {
          normal: {
            show: true,
            formatter: "{c}万元",
            // formatter: params => {
            //   return '{a|' + params.name + '}\n{b|' + params.value + '}'
            // },
            position: 'outside',
            color: "#fff"
          },
          emphasis: {
            show: true,
          },
        },
        labelLine: {
          show: true, //显示引导线
          length: 30, //连接饼图第1段线条的长度 length length2 不写自适应
          length2: 10, //链接饼图第2段线条长度
          smooth: true, //是否光滑连接线
        },
        // label: {
        //   show: true,
        //   position: 'center'
        // },
  
        emphasis: {
          label: {
            show: true,
            fontSize: '20',
            fontWeight: 'bold',
            formatter: params => {
              return '{a|' + params.name + '}\n{b|' + params.value + '万元'+'}'
            },
            rich: {
              a: {},
              b: {}
            }
          }
        },
        data: data
      }
    ]
  };
}